﻿@{
    ViewBag.Title = "Import Roster";
}
<h2>
    Import Roster</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<p>
    To complete roster import, please select the appropriate headers for Student IDs
    and Sections:</p>
<div class="selector">
    <h3>
        Student Identification Header:</h3>
    <ul id="id_selector" class="selector">
        @foreach (string h in ViewBag.headers)
        {
            <li @if (h == ViewBag.GuessedIdentification)
                {<text>class="selected"</text>}>@h</li>
        }
    </ul>
</div>
<div class="selector">
    <br />
    <h3>
        Section Header <em>(optional)</em>:</h3>
    <ul id="section_selector" class="selector">
        <li class="@if (ViewBag.GuessedSection == null)
                   {<text>selected</text>}> none_select"><em>None</em></li>
        @foreach (string h in ViewBag.headers)
        {
            <li @if (h == ViewBag.GuessedSection)
                {<text>class="selected"</text>}>@h</li>
        }
    </ul>
    @if (ViewBag.GuessedName2 == null)
    {
        <div class="selector">
            <br />
            <h3>
                Student Name Header <em>(optional)</em>:</h3>
            <ul id="name_selector" class="selector">
                <li class="@if (ViewBag.GuessedSection == null)
                           {<text>selected</text>}> none_select"><em>None</em></li>
                @foreach (string h in ViewBag.headers)
                {
                    <li @if (h == ViewBag.GuessedName)
                        {<text>class="selected"</text>}>@h</li>
                }
            </ul>
        </div>
    }
    else
    {
        <div class="selector">
            <br />
            <h3>
                Student First Name Header <em>(optional)</em>:</h3>
            <ul id="name_selector" class="selector">
                <li class="@if (ViewBag.GuessedSection == null)
                           {<text>selected</text>}> none_select"><em>None</em></li>
                @foreach (string h in ViewBag.headers)
                {
                    <li @if (h == ViewBag.GuessedName)
                        {<text>class="selected"</text>}>@h</li>
                }
            </ul>
        </div>
        <div class="selector">
            <br />
            <h3>
                Student Last Name Header <em>(optional)</em>:</h3>
            <ul id="name2_selector" class="selector">
                <li class="@if (ViewBag.GuessedSection == null)
                           {<text>selected</text>}> none_select"><em>None</em></li>
                @foreach (string h in ViewBag.headers)
                {
                    <li @if (h == ViewBag.GuessedName2)
                        {<text>class="selected"</text>}>@h</li>
                }
            </ul>
        </div>
    }
    <script type="text/javascript">

        $('.selector > li').click(function () {
            $(this).siblings().removeClass("selected");
            $(this).addClass("selected");
        });

        $('#id_selector > li').click(function () {
            $('#id_column').val($(this).html());
        });

        $('#section_selector > li').click(function () {
            if (!$(this).hasClass('none_select')) {
                $('#section_column').val($(this).html());
            } else {
                $('#section_column').val(null);
            }
        });

        $('#name_selector > li').click(function () {
            if (!$(this).hasClass('none_select')) {
                $('#name_column').val($(this).html());
            } else {
                $('#name_column').val(null);
            }
        });

    </script>
    <div id="import_roster_tools">
        @using (Html.BeginForm("ApplyRoster", "Roster", FormMethod.Post))
        {
            <input type="hidden" id="id_column" name="idColumn" value="@ViewBag.GuessedIdentification" />
            <input type="hidden" id="section_column" name="sectionColumn" value="@ViewBag.GuessedSection" />
            <input type="hidden" id="name_column" name="nameColumn" value="@ViewBag.GuessedName" />
            <input type="hidden" id="name2_column" name="name2Column" value="@ViewBag.GuessedName2" />
            <input type="submit" value="Import Roster" />

        }
        <br />
        @Html.ActionLink("Back to Roster", "Index")
    </div>
</div>